<template>
  <dv-full-screen-container>
    <div class="flex" style="gap:20px;">
      <div style="flex:2;height:30vh;">
        <dv-border-box10 title="测试" :color="['#f00', '#0f0']">
          <dv-percent-pond :config="config" style="height:30vh" />
        </dv-border-box10>
      </div>
      <div style="flex:1;height:30vh">
        <dv-water-level-pond :config="config2" style="height:30vh"/>
      </div>
    </div>
  </dv-full-screen-container>
</template>
<script setup>
const config = reactive({
  value: 86,
})
const config2 = reactive({
  data: [16]
})
setTimeout(() => {
  config.value = 30
}, 1000)
</script>